@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,300;1,300&display=swap');

body,
html {
  margin: 0;
  font-size: 14px !important;
  padding: 0;

  font-family: -apple-system, 'Segoe UI', 'Helvetica Neue', sans-serif;

  @apply dark:bg-gray-900;
}

body {
  min-height: 100vh;

  @apply overflow-hidden;
}

body a {
  @apply text-primary-default transition-colors;
  text-decoration: none;
}

body a:hover {
  @apply text-primary-shallow;
}

button:focus,
button {
  outline: unset;
}

*::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

*::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-thumb:hover {
  @apply bg-primary-shallow;

  background-clip: padding-box;
  border: 3px solid transparent;
  border-radius: 5px;
}

*::-webkit-scrollbar-corner {
  background: var(--light-bg);
}

.n-scrollbar-rail {
  @apply z-100;
}

.n-message {
  @apply !rounded-full;
}

.n-notification-main-footer {
  @apply !block;
}

@layer components {
  .modal-card {
    @apply !max-w-[90vw] !w-[60rem];

    &.sm {
      @apply !w-[40rem];
    }

    &.xs {
      @apply !w-[30rem];
    }
  }
}

* {
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
}

.n-list-item {
  .n-list-item__prefix {
    align-self: flex-start;
  }

  .n-thing-avatar {
    @apply self-center;
  }
}

.n-tabs-tab {
  padding-top: 10px !important;
}
